<include file="public@header" />
<link rel="stylesheet" href="__STATIC__/layui/dist/css/layui.css" media="all">
<body>
	<form class="layui-form" action="{:url('cloud/recharge')}" id="fm" method="post">
	    
		<div class="layui-form-item">
			<label class="layui-form-label" style="width:100px;">充值账户</label>
			<div class="layui-input-block">
				<input id="username" type="text" name="username" readonly class="layui-input" value="{$userInfo.username}">
			</div>
		</div>
		
        <div class="layui-form-item">
            <label class="layui-form-label" style="width:100px;">充值金额</label>
            <div class="layui-input-block">
                <select name="amount" id="amount">
                    <?php foreach($priceList as $k=>$v) { ?>
					<option value="<?=$k?>"><?=$v?></option>
					<?php } ?>
                </select>
            </div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label" style="width:100px;">充值方式</label>
            <div class="layui-input-block">
                <select name="payType" id="payType">
                    <?php foreach($payType as $k=>$v) { ?>
					<option value="<?=$k?>"><?=$v?></option>
					<?php } ?>
                </select>
            </div>
        </div>
		
		<div class="layui-form-item">
			<div class="layui-input-block">
				<button type="button" class="layui-btn layui-btn-default layui-btn-info" onclick="tijiao(this)">确认充值</button>
			</div>
		</div>
	</form>
	
	<script src="__STATIC__/layui/dist/layui.js"></script>
	<script>
	    layui.use('form', function(){
            var form = layui.form
            , layer = layui.layer;
            form.render();
        });
        var timmer = null, timmerRun = 0;
		function tijiao() {
		    let amount = $('#amount option:selected').val();
		    let payType = $('#payType option:selected').val();
		    $.post("{:url('cloud/recharge')}", {'amount': amount, 'payType': payType}, function(res) {
		        if(res.code == 1) {
		            timmer = setInterval(function() {
		    	        timmerRun += 1;
		    	        state(res.data.id)
		    	    }, 2000)
		            window.open(res.data.payUrl)
		      	} else {
		      	    layer.alert(res.msg);
		      	}
		    })
		}
		function state(oid) {
		    if (timmerRun > 100) {
		        layer.alert("充值超时");
		        clearInterval(timmer)
		    } else {
		        $.post("{:url('cloud/state')}", {'oid': oid}, function(res) {
		            if(res.code == 1) {
		                clearInterval(timmer)
		                layer.alert(res.msg, function() {
    		                parent.location.reload();
    		            })
    		        } else {
    		            console.log(res.msg)
    		        }
    		    })
		    }
		}
	</script>
</body>
</html>